* {
    margin: 0;
    padding: 0;
}

body {
    min-width: 1230px;
    overflow-anchor: none;
    background-color: #eee;
}

ul,
ol {
    list-style: none;
}



.main_content {
    width: 100%;
    min-width: 1358px;
    height: auto;
    margin: 0 auto;
    /* 缩放比例 */
    zoom: 1;
}

/* part1 */
.part1 {
    width: 1358px;
    height: auto;
    margin: 0 auto;
    padding: 40px 0 80px 0;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}

/* 轮播 */
/* 轮播css1 */
.main_scroll {
    width: 820px;
    height: 380px;
    overflow: hidden;
    background-color: #e3e2e2;
    position: relative;
}

.main_scroll ul {
    width: 4250px;
    height: 340px;
    display: flex;
    flex-flow: row nowrap;
    transform: translateX(0);
    animation: scroll_part1 linear 10s;
    animation-iteration-count: infinite;
}

.main_scroll ul li {
    width: 820px;
    height: 340px;
}

/* 轮播css2 */
/* .lunbo {
    height: 340px;
    width: 820px;
    overflow: hidden;
}

.lunbo ul{
    width: 4920px;
    padding: 0%;
    margin: 0%;
}

.lunbo ul li {
    position: relative;
    width: 820px;
    float: left;
    animation:lunbo 10s infinite;
}

.lunbo ul li img {
    width: 820px;
    height: 340px;
} */


.wrap {
    width: 820px;
    height: 340px;
    position: relative;
}
.list {
    width: 820px;
    height: 340px;
    list-style: none;
    position: relative;
    padding-left: 0px;
}
.item {
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;   
    /* 透明度 0*/
    transition: all .8s;  
 
}
.item:nth-child(1) {
    /* background-color:black; */
}
.item:nth-child(2) {
    /* background-color:red; */
}
.item:nth-child(3) {
    /* background-color:goldenrod; */
}
.item:nth-child(4) {
    /* background-color:green; */
}
.item:nth-child(5) {
    /* background-color:pink; */
}
/* .btn {
    width: 50px;
    height: 100px;
    position: absolute;
    top: 150px;
}
#goPre {
    left: 0px;
    z-index: 11;
}
#goNext {
    right: 0px;
    z-index: 11;
} */

.item.active {
    opacity: 1;
    z-index: 10;
}
/* 轮播文字 */
.scroll_title_list {
    width: 820px;
    height: 40px;
    overflow: hidden;
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-evenly;

}

.scroll_title {
    width: 164px;
    height: 40px;
    box-sizing: border-box;
    background-color: #e3e2e2;
    font-size: 14px;
    text-align: center;
    line-height: 40px;
    color: #424242;
    letter-spacing: 1px;

    cursor: pointer;    
    /* 鼠标样式:小手 */
    
}

.pointList {
    width: 820px;
    height: 40px;
    overflow: hidden;
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-evenly;

    position:absolute;
}

.point {
    width: 164px;
    height: 40px;
    box-sizing: border-box;
    background-color: #e3e2e2;
    font-size: 14px;
    text-align: center;
    line-height: 40px;
    color: #424242;
    letter-spacing: 1px;

    color: #424242;
    background-color: #e3e2e2;
    border-bottom: none;

    cursor: pointer;    
    /* 鼠标样式:小手 */
}
.point.active {
    color: #ab8e66;
    background-color: #f7f6f6;
    border-bottom: 2px #cea861 solid;
}


/* .scroll_title.title1 {
    animation: scroll_part2 linear 10s;
    animation-iteration-count: infinite;
}

.scroll_title.title2 {
    animation: scroll_part2 linear 10s;
    animation-delay: 1.8s;
    animation-iteration-count: infinite;
}

.scroll_title.title3 {
    animation: scroll_part2 linear 10s;
    animation-delay: 3.8s;
    animation-iteration-count: infinite;
}

.scroll_title.title4 {
    animation: scroll_part2 linear 10s;
    animation-delay: 5.8s;
    animation-iteration-count: infinite;
}

.scroll_title.title5 {
    animation: scroll_part2 linear 10s;
    animation-delay: 7.8s;
    animation-iteration-count: infinite;
} */

/* 分栏导航模板 */
.part_top_tab {
    width: 100%;
    height: 35px;
    position: relative;
}

.part_h2_title {
    color: #000;
    font-size: 24px;
    line-height: 28px;
    font-weight: 400;
    width: auto;
    height: 35px;
    position: relative;
    left: -4px;
    box-sizing: border-box;
}

.part_h2_title:before {
    content: '\0020';
    display: inline-block;
    vertical-align: middle;
    width: 4px;
    height: 28px;
    background-color: #1da6ba;
    margin-right: 10px;
}

.part_tab_title {
    height: 35px;
    box-sizing: border-box;
    border-bottom: 1px #e0e2e2 solid;
    display: flex;
    flex-flow: row;
    justify-content: space-between;
    position: relative;
}

.part_tab_title li {
    position: relative;
    cursor: pointer;
    width: auto;
    min-width: 40px;
    height: 37px;
    overflow: visible;
    color: #676767;
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 35px;
    text-align: center;
}


.part_tab_title>li.selected,
.part_tab_title>li:hover {
    font-weight: 700;
    color: #1da6ba;
}

.part_tab_title>li:after {
    content: '\0020';
    position: absolute;
    background-image: url('Images/tab-title-selected.png');
    background-position: center center;
    box-sizing: border-box;
    display: none;
    width: 100%;
    height: 7px;
    left: 0;
    bottom: 0;
    transition: width .2s, left .2s, margin-left .2s;
}

.part_tab_title>li.selected:after,
.part_tab_title>li:hover:after {
    display: block;
    animation: news_tab_seleted .2s;
}

/* 新闻栏属性 */
.main_news {
    width: 496px;
    height: 380px;
    overflow: hidden;
}

/* 选择性覆盖模板*/
.main_news .part_top_tab {
    width: 496px;
    height: 35px;
    box-sizing: border-box;
}

.main_news .part_tab_title li {
    font-size: 18px;
    line-height: 24px;
}

/* 新闻内容导航 */
.news_content {
    width: 496px;
    height: 345px;
}

.news_content_list {
    width: 496px;
    height: 305px;
    position: relative;
}

.news_content_list>.first {
    list-style: none;
    background-position: 0 -458px;
    width: 496px;
    height: 59px;
    overflow: hidden;
    line-height: 59px;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    box-sizing: border-box;
    padding: 0 12px;

    /* 被修剪部分以省略号显示 */
    text-overflow: ellipsis;
    white-space: nowrap;
}

.news_content_list>.first a {
    color: #0da0b4;
}

.news_content_list>.first a:hover {
    color: #bb9a6c;
}


.news_info {
    list-style: none;
    width: 496px;
    height: 40px;
    line-height: 39px;
    overflow: hidden;
    box-sizing: border-box;
    border-top: 1px #e0e2e2 solid;
    text-align: left;
   
}

.news_type {
    display: inline-block;
    vertical-align: middle;
    width: 36px;
    height: 20px;
    box-sizing: border-box;
    font-size: 12px;
    border: 1px #69c5d2 solid;
    color: #1da6ba;
    line-height: 18px;
    text-align: center;
}

.news_info.inform>.news_type {
    color: #bb9a6c;
    border: 1px #c5ab86 solid;
}

.news_info.event>.news_type {
    color: #6388c5;
    border: 1px #97afc5 solid;
}

.news-href {
    display: inline-block;
    vertical-align: middle;
    width: 370px;
    height: 39px;
    overflow: hidden;
    margin-left: 20px;
    color: #424242;
    font-size: 14px;
    letter-spacing: 1px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.news_info.inform>.news-href:hover {
    color: #bb9a6c;
}

.news_info.event>.news-href:hover {
    color: #6388c5;
}


.btn_morenews {
    display: block;
    width: 496px;
    height: 40px;
    background-color: #e3e2e2;
    line-height: 40px;
    text-align: center;
}

.btn_morenews .sp1 {
    font-size: 14px;
    color: #676767;
}

.btn_morenews .sp2 {
    font-size: 14px;
    color: #7ea1a6;
}

.btn-morenews:hover {
    background-color: #dad8d8;
    border-radius: 4px;
}


/* 活动栏属性 */
.hot_action {
    width: 820px;
    height: 335px;
    margin-top: 50px;
}

/* 活动栏选择性覆盖模板 */
.hot_action .part_top_tab {
    display: flex;
    flex-flow: row;
}

.hot_action .part_tab_title {
    width: 670px;
    justify-content: flex-start;
    margin-left: 40px;
}

.hot_action .part_tab_title li {
    margin-right: 40px;
}

.action_content {
    width: 820px;
    height: 278px;
    margin-top: 21px;
}

.action_list {
    width: 820px;
    height: 278px;
    position: relative;
    display: flex;
    flex-flow: row;
    justify-content: space-between;
}

.action_info {
    width: 193px;
    height: 278px;
    overflow: hidden;
    position: relative;
    transition: transform .3s;
    transform: translateY(0);
    background-color: #fefefe;
}

.action_info>p {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 6px 10px 4px 10px;
    font-size: 14px;
    color: #424242;
    line-height: 18px;
    text-align: left;
}

.action_info:hover>p {
    color: #0da0b4
}

.action_info:hover {
    transform: translateY(-3%);
}

.endingtime {
    position: absolute;
    font-size: 12px;
    color: #1da6ba;
    left: 10px;
    bottom: 6px;
}

.action_info>.icon_new_1 {
    position: absolute;
    right: 10px;
    bottom: 8px;
}

.icon_new_1 {
    background-position: -301px -46px;
    width: 29px;
    height: 14px;
    display: inline-block;
    vertical-align: middle;
}

.act_hover_info {
    /* 黑色背景图 */
    background: url('Images/dark-repeat.png') repeat;
    display: none;
    width: 193px;
    height: 207px;
    line-height: 207px;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
}

.action_info:hover .act_hover_info {
    display: block;
}

.act_hover_border {
    display: block;
    position: absolute;
    left: 50%;
    margin-left: -94px;
    top: 50%;
    margin-top: -100px;
    background-position: 0 0;
    width: 188px;
    height: 200px;
    background: url('Images/icon_map2.png');
}

.act_hover_info_text {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    line-height: 1.5;
    padding: 0 10px;
}

.act_hover_info_text .p1 {
    font-size: 16px;
    font-weight: 400;
    color: #cdbe91;
}

.act_hover_info_text .p2 {
    font-size: 12px;
    color: #9d9c9c;
    max-height: 73px;
    overflow: hidden;
}

.herf_mark {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 0;
}

/* 功能导航 */
.function_nav {
    margin-top: 50px;
    width: 496px;
    height: 335px;
}

.btn_list {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}

.download {
    width: 366px;
    height: 168px;
    overflow: hidden;
    background-image: url('Images/download.png');
    transition: filter .5s;
    filter: brightness(1);
    position: relative;
}

.download:hover {
    filter: brightness(1.15);
}

.btn_herf_type0 {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
}

.btn_group {
    width: 118px;
    height: 168px;
}

.btn_group>ul {
    width: 118px;
    height: 168px;
    display: flex;
    flex-flow: column;
    overflow: hidden;
    justify-content: space-between;
}

.for_newplayer {
    background-position: -193px -316px;
    height: 76px;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    line-height: 76px;
    overflow: hidden;
    position: relative;
}

.for_newplayer_hover {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 120px;
    height: 100%;
    overflow: hidden;
    background-color: #fff;

    flex-flow: row;
    justify-content: space-evenly;
}

.for_newplayer:hover .for_newplayer_hover {
    display: flex;
}

.for_newplayer .for_newplayer_hover>a {
    width: 60px;
    box-sizing: border-box;
    border-right: 1px #eee solid;
    color: #424242;
    font-size: 12px;
    line-height: 30px;
}

.for_lead>.icon_lead {
    background-position: -244px -72px;
    width: 20px;
    height: 22px;
    margin: 18px auto 0 auto;
}

.for_gift>.icon_gift {
    background-position: -285px -99px;
    width: 18px;
    height: 21px;
    margin: 19px auto 0 auto;
}

.for_newplayer_hover>a:hover {
    color: #0da0b4;
}


.for_newplayer_hover>a>span {
    display: block;
}

.btn_group .btn_1>.btn_herf_type1 {
    display: block;
    background-position: -193px -316px;
    width: 118px;
    height: 76px;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    line-height: 76px;
    transition: filter .5s;
    filter: brightness(1);
}

.btn_1 .btn_herf_type1:hover {
    filter: brightness(1.15);
}

.btn_list .btn_2 {
    margin-top: 15px;
}

.btn_list .btn_2>.btn_herf_type2 {
    display: block;
    position: relative;
    width: 112px;
    height: 68px;
    color: #424242;
    text-align: center;
    line-height: 68px;
    background-color: #fefefe;
    transition: box-shadow .2s;
}

.btn_list .btn_2>.btn_herf_type2:hover {
    color: #0da0b4
}

.icon_onlineservice {
    background-position: -316px -12px;
    width: 22px;
    height: 20px;
}

.icon_rule {
    background-position: -219px -72px;
    width: 20px;
    height: 22px;
}

.icon_gameinfo {
    background-position: -343px -12px;
    width: 23px;
    height: 19px;
}

.icon_topplayer {
    background-position: -193px -72px;
    width: 21px;
    height: 22px;
}

.icon_chess {
    background-position: -280px -125px;
    width: 22px;
    height: 19px;
}

.btn_herf_type2>.icon_new_1 {
    position: absolute;
    left: 0;
}

.icon_method {
    background-position: -371px -12px;
    width: 22px;
    height: 19px;
}

.icon_universe {
    background-position: -274px -46px;
    width: 22px;
    height: 19px;
}

.icon_WeChat {
    background-position: -193px -46px;
    width: 22px;
    height: 21px;
}

.btn_2 .btn_herf_type2>span {
    display: inline-block;
    vertical-align: middle;
}

/* 新英雄新皮肤 */
.new_hero_skin {
    width: 820px;
    height: 254px;
    margin-top: 51px;
    display: flex;
    flex-flow: row;
    justify-content: space-between;
}

.new_hero,
.new_skin {
    position: relative;
    width: 402px;
    height: 254px;
    background-color: #f7f6f6;
}

.img_repeat {
    position: absolute;
    bottom: 0;
    left: 0;
    background: url('Images/hero_repeat.png') repeat;
    width: 100%;
    height: 133px;
}

.new_hero_skin_tab {
    position: absolute;
    display: block;
    left: 9px;
    top: 9px;
    width: auto;
    height: 20px;
    padding: 0 6px;
    border-radius: 2px;
    font-size: 12px;
    text-align: center;
    color: #cdbe91;
    line-height: 19px;
    background-color: #000;
}

.new_introduction {
    width: 100%;
    padding: 0 17px;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    bottom: 33px;
    font-size: 16px;
    font-weight: 700;
    color: #cdbe91;
}

.hero_name,
.skin_name {
    width: 100%;
    padding-left: 17px;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    bottom: 12px;
    font-size: 14px;
    color: #cfcfcf;
}

/* 英雄 hover*/
.new_hero_hover {
    position: absolute;
    top: 0;
    width: 402px;
    height: 254px;
    overflow: hidden;
    background: url('Images/dark-repeat.png') repeat;
    display: none;
}

.new_hero:hover .new_hero_hover,
.new_skin:hover .new_skin_hover {
    display: block;
    animation: frame_up .3s;
}

.new_hero_hover>.border {
    display: block;
    position: absolute;
    left: 3px;
    top: 3px;
    background-position: 0 0;
    width: 396px;
    height: 248px;
}

.new_hero_hover>.p1 {
    color: #cdbe91;
    font-size: 18px;
    position: absolute;
    left: 27px;
    top: 20px;
}

.new_hero_hover .hero_ability {
    padding-left: 27px;
    margin-top: 58px;
    width: 350px;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}

.new_hero_hover .hero_ability>li {
    font-size: 14px;
    color: #fff;
    text-align: left;
    line-height: 30px;
}

.hard_level.hard {
    display: inline-flex;
    vertical-align: middle;
    overflow: hidden;
    width: 111px;
    height: 4px;
}

.hard_level.hard>li {
    display: inline-block;
    width: 34px;
    height: 4px;
    background-color: #6c6c6c;
    margin-right: 3px;
}

.hard_level.hard>.mark {
    background-color: #fff;
}

.ab_level {
    display: inline-block;
    vertical-align: middle;
    width: 80px;
    height: 4px;
    background-color: #6c6c6c;
    position: relative;
}

.ab_level>span {
    display: block;
    position: absolute;
    height: 4px;
    left: 0;
    top: 0;
    width: 50%;
    background-color: #fff;
}

.ab_level.ab_ad>span {
    width: 70%;
}

.ab_level.ab_tk>span {
    width: 20%;
}

.ab_level.ab_tk>span {
    width: 60%;
}

.new_hero_herf {
    position: absolute;
    left: 25px;
    bottom: 18px;
    display: block;
    background-position: -401px -179px;
    width: 154px;
    height: 42px;
    color: #ffdb8b;
    font-size: 14px;
    text-align: center;
    line-height: 42px;
    transition: filter .5s;
    filter: brightness(1);
}

.new_hero_hover .new_hero_herf:hover {
    filter: brightness(1.15);
}

/* 皮肤 hover*/
.new_skin:hover .skin_hover_out{
    display: block;
}

.skin_hover_out {
    display: none;
    position: absolute;
    z-index: 1;
    left: -16.5px;
    top: -20px;
    overflow: hidden;
    background-color: #fff;
    box-shadow: 0 0 20px #aaa;
    width: 435px;
}

.skin_hover_out>img {
    display: block;
    width: 435px;
    height: 244px;
}

.skin_hovervideo {
    position: absolute;
    top: 0;
    width: 435px;
    height: 244px;
}

.skin_hovervideo>video {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.skin_hover_out .p1 {
    margin-top: 10px;
    width: 270px;
    height: 24px;
    overflow: hidden;
    line-height: 24px;
    box-sizing: border-box;
    padding-left: 11px;
    color: #0b0b0b;
    font-size: 16px;
    text-align: left;
}

.skin_hover_out .p2 {
    width: 270px;
    height: 20px;
    overflow: hidden;
    line-height: 20px;
    box-sizing: border-box;
    padding-left: 11px;
    color: #a1a1a2;
    font-size: 12px;
    text-align: left;
    margin-bottom: 10px;
}

.skin_herf,
.ver_herf {
    width: 86px;
    height: 29px;
    box-sizing: border-box;
    position: absolute;
    right: 10px;
    bottom: 17px;
    display: block;
    line-height: 27px;
    overflow: hidden;
    color: #bb9a6c;
    font-size: 14px;
    text-align: center;
    border: 1px #bb9a6c solid;
    transition: background-color .2s;
}

.skin_herf:hover,
.ver_herf:hover {
    background-color: #bb9a6c;
    color: white;
}

/* 版本导航 */
.version_nav {
    width: 496px;
    height: 255px;
    margin-top: 51px;
    display: flex;
    flex-flow: column wrap;
    justify-content: space-between;
}

.new_version {
    background-color: #f7f6f6;
    position: relative;
    width: 240px;
    height: 120px;
}

.new_version:hover .version_hover{
    display: block;
}

.version_hover {
    display: none;
    position: absolute;
    z-index: 1;
    left: -15px;
    top: -20px;
    overflow: hidden;
    background-color: #fff;
    box-shadow: 0 0 20px #aaa;
}

.version_hover>img {
    width: 270px;
    height: 186px;
    display: block;
}

.ver_hovervideo {
    /* background: #000; */
    position: absolute;
    width: 270px;
    height: 186px;
    top: 0;
}

.ver_hovervideo>video {
    width: 100%;
    height: 100%;
}

.new_version .version_hover>.p1 {
    margin-top: 10px;
    width: 270px;
    height: 24px;
    overflow: hidden;
    line-height: 24px;
    box-sizing: border-box;
    padding-left: 11px;
    color: #0b0b0b;
    font-size: 16px;
    text-align: left;
}

.version_hover .p2 {
    width: 270px;
    height: 20px;
    overflow: hidden;
    line-height: 20px;
    box-sizing: border-box;
    padding-left: 11px;
    color: #a1a1a2;
    font-size: 12px;
    text-align: left;
    margin-bottom: 10px;
}

/* 英雄背景故事 */
.hero_bg {
    background-color: #f7f6f6;
    position: relative;
    width: 240px;
    height: 120px;
    overflow: visible;
}

.hero_bg .hover_img {
    position: absolute;
    left: 0;
    top: 0;
    display: none
}

/* 数据分析 */
.hero_data {
    width: 242px;
    height: 180px;
    position: relative;
    margin-left: 14px;
    background-color: #f7f6f6;
}

.hero_data:hover .data_hover {
    display: block;
    animation: opacityin .3s;
}

.data_hover {
    display: none;
    width: 242px;
    height: 180px;
    line-height: 180px;
    background: url('Images/dark-repeat.png') repeat;
    position: absolute;
    top: 0;
    overflow: hidden;
    text-align: center;
}

.data_border {
    display: block;
    position: absolute;
    left: 50%;
    margin-left: -118.5px;
    top: 50%;
    margin-top: -87px;
    background-position: -401px 0;
    width: 237px;
    height: 174px;
}

.data_hover .info {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    line-height: 1.5;
    box-sizing: border-box;
    padding: 0 10px;
}

.data_hover .info>.p1 {
    font-size: 16px;
    font-weight: 400;
    color: #cdbe91;
    margin-bottom: 2px;
}

.data_hover .info>.p2 {
    overflow: hidden;
    font-size: 12px;
    color: #9d9c9c;
}

/* 周免 */
.week_free {
    float: right;
    width: 239px;
    height: 58px;
    overflow: visible;
    position: relative;
    margin-left: 17px;
}

.week_free_a {
    display: block;
    background-position: -193px -253px;
    width: 239px;
    height: 58px;
    line-height: 58px;
    text-align: center;
    font-size: 16px;
    color: #fff;
    transition: filter .5s;
    filter: brightness(1);
}

.week_free_a:hover {
    filter: brightness(1.15);
}

.icon_right,
.icon_left {
    display: inline-block;
    vertical-align: middle;
    margin: -1px 12px 0 12px;
    opacity: .7;
}

.icon_right {
    background-position: -506px -226px;
    width: 20px;
    height: 9px;
}

.icon_left {
    background-position: -531px -226px;
    width: 20px;
    height: 9px;
}

/* 鼠标触击周免出现周免英雄 */
.week_free_hover {
    display: none;
    width: auto;
    height: auto;
    background-color: #fff;
    position: absolute;
    top: 70px;
    box-shadow: 0 0 12px #bbb;
    padding: 6px 5px 10px 5px;
    z-index: 2;
    right: 0;
}

.week_free_hover::after {
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 70%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #fff transparent;
}

.hero_iconlist {
    width: 430px;
    overflow: hidden;
    margin: 0 auto;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
}

.hero_icon>img {
    display: block;
    width: 46px;
    height: 46px;
    border: 2px #bb9a6c solid;
    border-radius: 50%;
}

/* 更多皮肤 */
.more_skin {
    width: 1358px;
    height: 0;
    /* height: 117px; */
    /* margin-top: 42px; */
    transition: height .3s, margin-top .3s;
    position: relative;
    overflow: hidden;
}

.new_hero_skin:hover ~.more_skin {
    height: 120px !important;
    overflow: visible;
    width: 100%;
    margin-top: 42px;
}

.more_skin:hover {
    height: 120px !important;
    margin-top: 42px;
}

.more_skin .content {
    width: 1358px;
    display: flex;
    flex-flow: row;
    justify-content: space-between;
}

.more_skin_item {
    width: 185px;
    height: 117px;
    overflow: hidden;
    position: relative;
}

.more_skin_item>img {
    width: 185px;
    height: 117px;
    transition: transform .2s;
    transform: scale(1);
}

.more_skin_item:hover>img {
    transform: scale(1.1);
}

.more_skin_item .skin_name {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    text-align: center;
    color: #cdbe91;
    background: url('Images/dark-repeat.png') repeat;
}


.sl_action i,
.sl_event i,
.sl_hero i,
.sl_fanart i,
.sl_top i,
.link,
.icon_new_1,
.for_newplayer_hover>a>span,
.icon_onlineservice,
.icon_rule,
.icon_gameinfo,
.icon_topplayer,
.icon_chess,
.icon_method,
.icon_WeChat,
.icon_universe {
    background-image: url('Images/icon_map2.png');
    background-size: 393px 200px;
    background-repeat: no-repeat;
}

.btn_item.btn,
.icon_point,
.icon_666,
.list_item:hover .hover_icon:after,
.icon_leftarrow,
.icon_rightarrow,
.icon_left,
.icon_right,
.data_border,
.week_free_a,
.new_hero_herf,
.new_hero_hover>.border,
.news_content_list>.first,
.for_newplayer,
.btn_group .btn_1>.btn_herf_type1 {
    background-image: url('Images/icon_map3.png');
    background-size: 638px 572px;
    background-repeat: no-repeat;
}

/* 动画 */

.herf_more {
    position: absolute;
    top: 0;
    right: 2px;
    display: block;
    width: auto;
    height: 35px;
    font-size: 12px;
    color: #7ea1a6;
    line-height: 35px;
    z-index: 1;
}

.action_info:hover>.innerhover-border {
    display: block;
    animation: frame_up .2s;
}

@keyframes frame_up {
    0% {
        -webkit-transform: translateY(3%);
        transform: translateY(3%);
        opacity: 0
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

@keyframes news_tab_seleted {
    0% {
        opacity: .5;
        transform: scale(0);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.for_newplayer_hover>a:hover>span,
.btn_herf_type2:hover>span:not(.icon_new_1) {
    animation: skip ease 1.3s 1;
}
/* :not(p)  表示为非p设置属性 */
/* > == 空格  是后代选择器*/

@keyframes skip {

    0%,
    10%,
    100%,
    50%,
    70% {
        transform: scale(1);
    }
    /* 变大变小 */
    30% {
        transform: scale(.9);
    }

    40% {
        transform: scale(1.3);
    }

    60% {
        transform: scale(1.15);
    }
}


.hero_bg:hover .hover_img {
    display: block;
    animation: opacityin .5s;
}

@keyframes opacityin {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.week_free:hover>.week_free_hover {
    display: block;
    animation: topin .3s;
}

@keyframes topin {
    0% {
        transform: translateY(-10px);
        opacity: 0
    }

    100% {
        transform: translateY(0);
        opacity: 1
    }
}

/* 轮播图动画1 */
@keyframes scroll_part1 {

  100%,0%,
    18% {
        transform: translateX(0);
    }

    20%,
    38% {
        transform: translateX(-820px);
    }

    40%,
    58% {
        transform: translateX(-1640px);
    }

    60%,
    78% {
        transform: translateX(-2460px);
    }

    80%,
    98% {
        transform: translateX(-3280px);
    }
}

/* 轮播图动画2 */
@keyframes lunbo{
    100%,
    0%,18%{
		left: 0px;
	}
	20%,38%{
		left: -820px;
	}
	40%,58%{
		left:-1640px;
	}
	60%,78%{
		left: -2460px;
	}
	80%,98%{
		left: -3280px;
	}

}

@keyframes scroll_part2 {
    0% ,18%{
        color: #ab8e66;
        background-color: #f7f6f6;
        border-bottom: 2px #cea861 solid;
    }

    19%,
    100% {
        color: #424242;
        background-color: #e3e2e2;
        border-bottom: none;
    }
}